﻿@page "/login"

@*<MudIcon Icon="@Icons.Custom.Brands.MudBlazor" Size="Size.Large" Style="width:100px; height:100px;" />*@
<MudText Typo="Typo.h4" Class="mb-8" Align="Align.Center">maERP</MudText>

<MudForm Model="@_model" @ref="@_form" @bind-IsValid="@_success" ValidationDelay="0">

    <MudText Typo="Typo.h4" GutterBottom="true">Login</MudText>
    @*
        <MudText>
            Kein Account? <MudLink Href="/pages/authentication/register">Jetzt registrieren</MudLink>
        </MudText>
    *@
    <MudTextField T="string"
                  @bind-Value="_model.Email" For="@(() => _model.Email)"
                  Label="E-Mail"
                  Variant="Variant.Outlined"
                  Required="true"
                  OnlyValidateIfDirty="true"
                  Immediate="true"
                  Class="mt-6">
    </MudTextField>

    <MudTextField @bind-Value="_model.Password" For="@(() => _model.Password)"
                  Label="Passwort"
                  Variant="Variant.Outlined"
                  Required="true"
                  InputType="InputType.Password"
                  Class="mt-6">
    </MudTextField>

    <MudStack Row="true" Class="mt-6">
        <MudSelect Label="Server" @bind-Value="_model.Server" Variant="Variant.Outlined" Required="true">
            @foreach (var server in _serverList)
            {
                <MudSelectItem Value="@server.Url">@server.Url</MudSelectItem>
            }
        </MudSelect>
        <MudIconButton Icon="@Icons.Material.Outlined.Edit" OnClick="OpenServerOverlay" Class="my-3" />
    </MudStack>

    <div Class="d-flex justify-space-between align-center">
        <MudCheckBox For="@(() => _model.RememberMe)" @bind-Value="_model.RememberMe" Label="Eingeloggt bleiben" Color="Color.Primary" Class="ml-n1 my-3"></MudCheckBox>
        <MudLink Href="/pages/authentication/forgot-password">Passwort vergessen</MudLink>
    </div>

    <MudButton Variant="Variant.Filled"
               Color="Color.Primary"
               Size="Size.Large"
               Disabled="@(_loading)"
               ButtonType="ButtonType.Button"
               OnClick="@(OnSubmit)"
               FullWidth="true">
        @if (_loading)
        {
            <MudProgressCircular Class="ms-n1" Size="Size.Small" Indeterminate="true" />
            <MudText Class="ms-2">Lädt</MudText>
        }
        else
        {
            <MudText>Login</MudText>
        }

    </MudButton>
</MudForm>

<MudOverlay @bind-Visible="_showServerOverlay" DarkBackground="true" AutoClose="false">
    <MudPaper Width="auto">

        <MudContainer Class="py-8">
            <MudDataGrid Items="@_serverList" Filterable="false" SortMode="@SortMode.None" Groupable="false" FixedHeader="true ">
                <Columns>
                    <PropertyColumn Property="x => x.Url" Title="URL" />
                    <PropertyColumn Property="x => x.LastUsed" Title="Zuletzt benutzt" />
                    <TemplateColumn>
                        <CellTemplate>
                            <MudStack Row>
                                <MudIconButton Size="@Size.Small" Icon="@Icons.Material.Outlined.Delete" OnClick="@(() => RemoveFromServerList(context.Item!.Url))" />
                            </MudStack>
                        </CellTemplate>
                    </TemplateColumn>
                </Columns>
            </MudDataGrid>

            <MudStack Row="true" Class="mt-6">
                <MudTextField InputType="InputType.Url" Label="Server hinzufügen" Variant="Variant.Outlined" @bind-Value="@newServer" />
                <MudIconButton Icon="@Icons.Material.Outlined.Add" OnClick="AddToServerList">Add</MudIconButton>
            </MudStack>

            <MudButton FullWidth="true" Variant="Variant.Filled" Color="Color.Primary" OnClick="OpenServerOverlay" Class="mt-6">Schließen</MudButton>
        </MudContainer>
    </MudPaper>
</MudOverlay>